<!doctype html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../assert_selection.js"></script>
<script>
test(() => assert_selection(
    [
        '<div contenteditable>',
            '^<table><tbody>',
                '<tr><td>1-1</td><td>2-1</td><td>3-1</td></tr>',
                '<tr><td>1-2</td><td>2-2</td><td>3-2</td></tr>',
                '<tr><td>1-3</td><td>2-3</td><td>3-3</td></tr>',
            '</tbody></table>|',
        '</div>',
    ].join(''),
    'delete',
    [
        '<div contenteditable>',
            '|<br>',
        '</div>',
    ].join('')),
    '1 Delete TABLE');

test(() => assert_selection(
    [
        '<div contenteditable>',
            '^<span style="visibility:hidden">foo</span>bar|',
        '</div>',
    ].join(''),
    'delete',
    [
        '<div contenteditable>',
            '|',
        '</div>',
    ].join('')),
    '2-1 Delete visibility:hidden');

test(() => assert_selection(
    [
        '<div contenteditable>',
            '^<span style="display:none">foo</span>bar|',
        '</div>',
    ].join(''),
    'delete',
    [
        '<div contenteditable>',
            '|',
        '</div>',
    ].join('')),
    '2-2 Delete display:none');

test(() => assert_selection(
    [
        '<div contenteditable>',
            '<ul>',
                '<li>^one</li>',
                '<li>two</li>',
                '<li>three|</li>',
            '</ul>',
        '</div>',
    ].join(''),
    'delete',
    [
        '<div contenteditable>',
            '<ul>',
                '<li>|<br></li>',
            '</ul>',
        '</div>',
    ].join('')),
    '3 Delete UL');
</script>
